<template>
    <div :class='$style.box'>
        <div :class='$style.header'>{{title}}</div>
        <div :class='$style.body'>
            <slot></slot>
        </div>
    </div>
</template>

<script lang='ts' setup>
    defineProps<{
        title : string;
    }>()
</script>

<style lang='scss' module>
    .box{
        border-radius: 4px;
    }
    .header{
        height: 54px;
        background: #F2F6FE;
        border-radius: 4px 4px 0px 0px;
        padding-left: 16px;
        display: flex;
        align-items: center;
        font-size: 16px;
        color: #001529;
        font-weight: 500;
    }

    .body{
        background: #fff;
        padding: 16px 16px;
    }
</style>